import { connect } from 'dva';
import React from 'react';

import { LinkageChartsC } from '@/src/comps';
import { debounceFn } from '@/src/utils/commonFunc';

// eslint-disable-next-line react/no-redundant-should-component-update
class LeftCharts extends React.Component {
  click = (e) => {
    const { seriesName, name, seriesIndex } = e;
    const { xAxis1 } = this.props;
    let date = name;
    // 点击自定义图标的时候 处理date
    if (date === 'line-max' || date === 'bar-max') {
      date = xAxis1[xAxis1.length - 1];
    }
    if (date === 'line-min' || date === 'bar-min') {
      // eslint-disable-next-line prefer-destructuring
      date = xAxis1[0];
    }
    // 右侧列表的查询type判断， 关键key，seriesName， seriesIndex
    let typePayload = 'scale';
    if (seriesName === '产品数量' || seriesIndex === 0) {
      this.props.setColumn(true);
      typePayload = 'scale';
    }
    if (seriesName === '产品规模' || seriesIndex === 1) {
      this.props.setColumn(false);
      typePayload = 'num';
    }

    // click获取右侧信息
    this.props.clickProps({
      date,
      type: typePayload,
    });
    // this.getRightData({
    //   date,
    //   type: typePayload,
    // });
  };

  shouldComponentUpdate(nextProps) {
    const preseries = JSON.stringify(this.props.series1);
    const nextseries = JSON.stringify(nextProps.series1);
    const pretargetTableHeight = JSON.stringify(this.props.targetTableHeight);
    const nexttargetTableHeight = JSON.stringify(nextProps.targetTableHeight);
    // const predataSource = JSON.stringify(this.props.dataSource);
    // const nextdataSource = JSON.stringify(nextProps.dataSource);
    if (preseries === nextseries && pretargetTableHeight === nexttargetTableHeight) {
      return false;
    }
    return true;
  }

  render() {
    const { xAxis1, series1, yAxis1, dataSource, targetTableHeight } = this.props;
    return (
      <LinkageChartsC
        xAxis={xAxis1 || []}
        series={series1 || []}
        yAxis={yAxis1 || []}
        height={dataSource.length === 0 || dataSource.length !== 10 ? '515px' : `${targetTableHeight}px`}
        dataZoom
        toolTipDataFormat={[(value, item) => `${value} ${item.axisIndex === 1 ? '亿元' : '只'}`, (value, item) => `${value} ${item.axisIndex === 1 ? '亿元' : '只'}`]}
        click={(e) => debounceFn(this.click, e)}
        isMarkPoint
      />
    );
  }
}

export default connect(({ organProductAnalysisM, loading }) => ({
  organProductAnalysisM,
  loading,
}))(LeftCharts);
